<template>
  <el-tag class="tag-status"
          :effect="effect"
          v-if="label"
          :class="mapper"
          size="small"
          :type="currType"
          v-bind="$attrs"
  >
    <slot>
      {{label}}
    </slot>
  </el-tag>
</template>

<script>
const _CACHE = {}

const types = {
  ENABLE_FLAG: {
    1: 'success',
    0: 'danger'
  },
  PUBLISH_FLAG: {
    1: 'success',
    0: 'danger'
  }
}

function getTypeByMapper(value, mapper) {
  if(types[mapper]) {
    return types[mapper][value] || ''
  }
  return 'primary'
}

function getDictMap(key) {
  if(_CACHE[key]) {
    return _CACHE[key]
  }
  const dictMap = JSON.parse(localStorage.getItem('REPORT_DICT'))
  const list = dictMap[key]

  const map = {}
  list.forEach(t => {
    map[t.itemValue] = t.itemName
  })
  _CACHE[key] = map
  return map
}


export default {
  name: 'report-status',
  cnName: 'report-状态',
  props: {
    value: [String, Number],
    type: String,
    mapper: {
      type: String
    },
    effect: {
      type: String,
      default: 'light'
    }
  },
  data() {
    return {
      '01': {
        0: '否',
        1: '是'
      }
    }
  },
  methods: {},
  watch: {},
  computed: {
    label() {
      const value = this.value
      const map = getDictMap(this.mapper)
      return map[value] || value
    },
    currType() {
      if(this.type) {
        return this.type
      }
      const map = getDictMap(this.mapper)
      const value = map[this.value]
      if(value && value.type) {
        return value.type
      }

      return getTypeByMapper(this.value, this.mapper)
    }
  },
  mounted() {

  }
}
</script>

<style lang="scss" scoped>
.tag-status {
  font-size: inherit;

}
</style>
